import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';

import '../../../../app_files.dart';
import 'action.dart';
import 'state.dart';

Widget buildView(
    XABleSaveViewState state, Dispatch dispatch, ViewService viewService) {
  return Scaffold(
    appBar: myAppBar(viewService.context, title: '确认圈存'),
    body: MyInkWellWidget(
      child: Column(
        children: [
          Stack(
            children: [
              Container(
                height: 60,
                width: double.infinity,
                color: ThemeConfig.mainColor,
                margin: EdgeInsets.only(bottom: 45),
              ),
              Positioned(
                child: Container(
                  height: 70,
                  width: double.infinity,
                  margin: EdgeInsets.symmetric(horizontal: 15),
                  padding: EdgeInsets.only(left: 15),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.all(Radius.circular(4)),
                    color: Colors.white,
                    boxShadow: [
                      BoxShadow(
                          color: ThemeConfig.rgba(9, 35, 88, 0.07),
                          offset: Offset(1.0, 1.0),
                          blurRadius: 4.0,
                          spreadRadius: 1.0),
                    ],
                  ),
                  child: Row(
                    children: [
                      Image.asset('images/i_icCard.png'),
                      Padding(padding: EdgeInsets.only(left: 20)),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            state.model.name,
                            style: TextThemeConfig.Font15WithColor22,
                          ),
                          Padding(padding: EdgeInsets.only(top: 4)),
                          Row(
                            children: [
                              Text(
                                state.model.accountNo,
                                style: TextThemeConfig.Font13WithColor99,
                              ),
                            ],
                          )
                        ],
                      ),
                    ],
                  ),
                ),
                top: 30,
                left: 0,
                right: 0,
              ),
            ],
          ),
          Container(
            margin: EdgeInsets.symmetric(horizontal: 15),
            child: Row(
              children: [
                Container(
                  child: Text(
                    '蓝牙卡号：',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  width: 90,
                ),
                Expanded(
                  child: TextField(
                    minLines: 1,
                    controller: state.numberController,
                    keyboardType: TextInputType.number,
                    style: TextThemeConfig.Font14WithColor22,
                    decoration: InputDecoration(
                      border: InputBorder.none,
                      hintText: "请输入蓝牙卡号",
                      hintStyle: TextThemeConfig.Font14WithColor99,
                      contentPadding: EdgeInsets.only(bottom: 0),
                    ),
                  ),
                ),
                MyInkWellWidget(
                  child: Container(
                    margin: EdgeInsets.only(left: 15),
                    padding: EdgeInsets.symmetric(horizontal: 8),
                    height: 30,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(4)),
                      color: ThemeConfig.mainColor,
                    ),
                    child: MyInkWellWidget(
                      child: Center(
                        child: Text(
                          '连接蓝牙卡',
                          style: TextThemeConfig.Font12WithColorWhite,
                        ),
                      ),
                      onTap: () =>
                          dispatch(XABleSaveViewActionCreator.onConnect()),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Container(
              margin: EdgeInsets.only(top: 40, left: 50, right: 50, bottom: 40),
              child: Column(
                children: [
                  Text(
                    '操作提示：\r\n1、打开蓝牙卡开关。\r\n2、将手机蓝牙设置为打开状态。\r\n3、输入蓝牙卡卡号。先连接蓝牙卡\r\n4、连接成功后，点击确认圈存r\r\n5、根据提示上表',
                    style: TextThemeConfig.Font14WithColor99,
                  ),
                  Text(
                    '上表前要保持蓝灯闪烁 不然会提示卡编号错误',
                    style: TextThemeConfig.Font14WithColorRed,
                  ),
                ],
              )),
          Column(
            children: [
              Row(
                children: [
                  Expanded(
                    child: Container(
                      margin: EdgeInsets.only(left: 15, right: 15),
                      width: double.infinity,
                      height: 50,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(4)),
                        color: state.cardContent == null
                            ? Colors.grey
                            : state.model.status != '1'
                                ? Colors.grey
                                : ThemeConfig.mainColor,
                      ),
                      child: MyInkWellWidget(
                        child: Center(
                          child: Text(
                            '确认圈存',
                            style: TextThemeConfig.Font16WithWhite,
                          ),
                        ),
                        onTap: () =>
                            dispatch(XABleSaveViewActionCreator.onSubmit()),
                      ),
                    ),
                  ),
                ],
              ),
              Padding(
                padding: EdgeInsets.only(top: 20),
              ),
              MyInkWellWidget(
                child: Padding(
                  padding: EdgeInsets.only(top: 20, left: 12, right: 12,bottom: 20),
                  child: Text(
                    '设置上表模式',
                    style: TextThemeConfig.Font12WithMainColor,
                  ),
                ),
                onTap: () => dispatch(XABleSaveViewActionCreator.onNetWork()),
              )
            ],
          )
        ],
      ),
      onTap: () => CommonUtils.closeKey(viewService.context),
    ),
  );
}
